<script setup>
import {onMounted, reactive, ref} from "vue";
import request from "@/requests/request.js";
import {ElMessage} from "element-plus";
const emits = defineEmits('visible')
const lectureForm = reactive({
  classId: null,
  courseId: null,
  teacherId: null,
  semester: null,
  type: null
})
const courseOptions = ref([])
const classOptions = ref([])
const teacherOptions = ref([])
const semesterOptions = ref([
  { id: 1, name: '大一上' },
  { id: 2, name: '大一下' },
  { id: 3, name: '大二上' },
  { id: 4, name: '大二下' },
  { id: 5, name: '大三上' },
  { id: 6, name: '大三下' },
  { id: 7, name: '大四上' },
  { id: 8, name: '大四下' },
])
onMounted(() => {
  request.get('/class/get-all-info').then(res => {
    classOptions.value = res.data.data
  })
  request.get('/teacher/get-teacher-node').then(res => {
    teacherOptions.value = res.data.data
  })
  request.get('/course/get-course-list').then(
      res => {
        courseOptions.value = res.data.data
      }
  )
})
const lectureFormRef = ref(null)
const rules = ref({
  classId: [
    { required: true, message: '请选择班级', trigger: 'change' },
  ],
  courseId: [
    { required: true, message: '请选择课程', trigger: 'change' },
  ],
  teacherId: [
    { required: true, message: '请选择教师', trigger: 'change' },
  ],
  semester: [
    { required: true, message: '请选择学期', trigger: 'change' },
  ],
  type: [
    { required: true, message: '请选择类型', trigger: 'change' },
  ],
})
const submitForm = (rules) => {
  lectureFormRef.value.validate((valid) => {
    if (valid) {
      request.put('/lecture/add', lectureForm).then(res => {
        if (res.data.code === 200) {
          ElMessage.success('添加成功')
        } else {
          ElMessage.error(res.data.message)
        }
        emits('visible', false)
      })
    }
  })
}
</script>

<template>
<el-form label-width="100px" :model="lectureForm" style="max-width: 460px" :rules="rules" ref="lectureFormRef">
  <el-form-item label="课程" prop="courseId">
    <el-select v-model="lectureForm.courseId" placeholder="请选择课程" filterable>
      <el-option v-for="item in courseOptions" :key="item.courseId" :label="item.name" :value="item.courseId" />
    </el-select>
  </el-form-item>
  <el-form-item label="教师" prop="teacherId">
    <el-select v-model="lectureForm.teacherId" placeholder="请选择教师" filterable>
      <el-option v-for="item in teacherOptions" :key="item.id" :label="item.name" :value="item.id" />
    </el-select>
  </el-form-item>
  <el-form-item label="课程" prop="classId">
    <el-select v-model="lectureForm.classId" placeholder="请选择班级" filterable>
      <el-option v-for="item in classOptions" :key="item.classId" :label="item.name" :value="item.classId" />
    </el-select>
  </el-form-item>
  <el-form-item label="类型" prop="type">
    <el-radio-group v-model="lectureForm.type">
      <el-radio label="专业必修">专业必修</el-radio>
      <el-radio label="专业选修">专业选修</el-radio>
      <el-radio label="通识选修">通识选修</el-radio>
    </el-radio-group>
  </el-form-item>
  <el-form-item label="学期" prop="semester">
    <el-select v-model="lectureForm.semester" placeholder="请选择学期" filterable>
      <el-option v-for="item in semesterOptions" :key="item.id" :label="item.name" :value="item.id" />
    </el-select>
  </el-form-item>
  <el-form-item>
    <el-button @click="emits('visible', false)">取消</el-button>
    <el-button type="primary" @click="submitForm(rules)">提交</el-button>
  </el-form-item>
</el-form>
</template>

<style scoped>

</style>
